<template>
  <div>
    <h3>Right组件</h3>
    <p ref="abc">这是right组件</p>
    <button @click="show">点击输出内容</button>
  </div>
</template>

<script>
export default {
  methods: {
    show () {
      // 通过ref查找元素的语法  this.$refs.页面中的ref值
      // 如果使用ref查找元素，只会在当前组件中查找元素
      console.log(this.$refs.abc.innerHTML)

      // document.querySelector() 是在整个页面中查找元素
      // console.log(document.querySelector('p').innerHTML)
    }
  }
}
</script>

<style lang="less" scoped>
h3 {
  color:burlywood;
}
</style>